import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View,Image } from 'react-native';

import ImageViewer from "@/app/components/image/ImageViewer";
import Button from "@/app/components/Button";

const PlaceholderImage = require('../../assets/images/react-logo.png');

export default function Test01() {
    return (
        <View style={styles.container}>
            <View style={styles.imageContainer}>
                <ImageViewer placeholderImageSource={PlaceholderImage}/>
            </View>
            <View style={styles.footerContainer}>
                <Button theme="primary" label="Choose a photo" />
                <Button theme={undefined} label="Use this photo" />
            </View>
            <StatusBar style="auto"/>
        </View>
    );
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#25292e',
        alignItems: 'center',
        justifyContent: 'center',
    },
    imageContainer: {
        flex: 1,
        paddingTop: 58,
    },
    footerContainer: {
        flex: 1 / 3,
        alignItems: 'center',
    },
});
